<script setup>
  import { ref } from 'vue'
  import { onLoad } from '@dcloudio/uni-app'
  import slVehicleViolation from './components/vehicle-violation'
  import slVehicleBreakdown from './components/vehicle-breakdown'
  import slVehicleAccident from './components/vehicle-accident'
  import { useTaskStore } from '@/stores/tast.js'
  import taskApi from '@/apis/task.js'

  const taskStore = useTaskStore()

  // // 回车时间
  // const dataTimePicker = ref('')
  // // 出发时间
  // const startTime = ref('')
  // // 任务id
  // const transportTaskId = ref(0)
  onLoad((params) => {
    // 获取url
    // transportTaskId.value = params.transportTaskId
    // // 获取时间
    // startTime.value = params.data
    taskStore.recordData.id = params.transportTaskId
    taskStore.recordData.startTime = params.data
  })
  async function onSubmit() {
    try {
      // 获取所有数据
      const body = taskStore.recordData
      // 非空判断
      if (!body.id || !body.startTime || !body.endTime) {
        return uni.utils.toast('任务id,发车时间，回车时间不能为空')
      }
      // 发送接口请求
      const { code, msg } = await taskApi.record(body)
      if (code !== 200) {
        return uni.utils.toast(msg)
      }
      // 跳转回task首页
      uni.switchTab({
        url: '/pages/task/index',
      })
    } catch (err) {
      uni.utils.toast('网络异常，请稍后重试')
    }
  }
</script>
<template>
  <view class="page-container">
    <scroll-view class="scroll-view" scroll-y>
      <view class="scroll-view-wrapper">
        <uni-list class="base-info">
          <uni-list-item
            title="出车时间"
            show-arrow
            :right-text="taskStore.recordData.startTime"
          />
          <uni-list-item show-arrow title="回车时间">
            <template v-slot:footer>
              <uni-datetime-picker v-model="taskStore.recordData.endTime">
                <view class="picker-value">{{
                  taskStore.recordData.endTime || '请选择'
                }}</view>
              </uni-datetime-picker>
            </template>
          </uni-list-item>
        </uni-list>
        <sl-vehicle-violation></sl-vehicle-violation>
        <sl-vehicle-breakdown></sl-vehicle-breakdown>
        <sl-vehicle-accident></sl-vehicle-accident>
      </view>
    </scroll-view>
    <view class="toolbar">
      <button class="button" @click="onSubmit">提交登记</button>
    </view>
  </view>
</template>

<style lang="scss" scoped>
  @import './index.scss';
</style>
